{% extends 'store/base.html' %}

{% block content %}
    <div class="container-fluid">
            <!--添加商品按钮-->
          <div class="row">
                <button class="btn btn-primary col-lg-2 ml-auto" data-toggle="modal" data-target="#goods_modal">添加商品类型</button>
          </div>
          <h1></h1>
            <!--商品列表-->
          <div class="row">
              <table class="table">
                  <thead>
                    <tr>
                        <th>类型编号</th>
                        <th>类型名称</th>
                        <th>类型图片</th>
                        <th>类型操作</th>
                    </tr>
                  </thead>
                  <tbody>
                  {% for t in t_list %}
                    <tr>
                        <td>{{ t.id }}</td>
                        <td>
                            <a href="#">{{ t.type_name }}</a>
                        </td>
                        <td>
                            <img src="/static/{{ t.type_picture }}" width="50px">
                        </td>
                        <td>
                            <a href="/Store/edit_type/{{ t.id }}/" class="btn btn-primary" style="color: white">编辑</a>
                            <a href="/Store/del_type/{{ t.id }}/" class="btn btn-danger" style="color: white">删除</a>
                        </td>
                    </tr>
                  {% endfor %}
                  </tbody>
              </table>
          </div>
          <h1></h1>
            <!--分页-->
          <div class="row">
                <ul class="pagination ml-auto">
                    <li class="page-item">
                        <a class="page-link">上一页</a>
                    </li>
                    <li class="page-item">
                        <a class="page-link">1</a>
                    </li>
                    <li class="page-item">
                        <a class="page-link">2</a>
                    </li>
                                        <li class="page-item">
                        <a class="page-link">3</a>
                    </li>
                    <li class="page-item">
                        <a class="page-link">4</a>
                    </li>
                    <li class="page-item">
                        <a class="page-link">下一页</a>
                    </li>
                </ul>
          </div>
        </div>

    <div class="modal fade" id="goods_modal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-label="true">
      <div class="modal-dialog" role="document">
          <div class="modal-content">
              <div class="modal-header">添加商品类型</div>
              <div class="modal-body">
                  <form class="form" method="post" action="/Store/add_type/" enctype="multipart/form-data">
                      {% csrf_token %}
                      <div class="form-group">
                        <label class="">类型名称</label>
                        <input class="form-control" type="text" name="t_name">
                      </div>

                      <div class="form-group">
                        <label class="">类型图片</label>
                        <input class="form-control" type="file" name="t_picture">
                      </div>
                      <button class="btn btn-primary fa-pull-right" type="submit">提交商品类型</button>
                  </form>
              </div>
          </div>
      </div>
  </div>

{% endblock %}